.main-color { 
	color: $main-color;
}
.main-ass-color {
	color: $main-ass-color
}
.ass-red-color {
	color: $ass-red-color
}
.ass-blue-color{
	color: $ass-blue-color;
}
.ass-orange-color{
	color: $ass-orange-color;
}
.font-color {
	color: $font-color;
}
.font-color-2 {
	color: $font-color-2;
}
.font-color-3 {
	color: $font-color-3;
}
.s-line-color {
	color: $s-line-color;
}
.back-color {
	background-color: $back-color;
}

.back-color-fff{
	background-color: #fff;
}
.color-fff {
	color: #fff;
}


@for $i from 0 to 50 {
  $i: $i + 2;
  .font-#{$i} {
    font-size: #{$i}rpx;
  }
}

@for $i from 0 to 200 {
  $i: $i + 5;
  .pr-#{$i} {
    padding-right: #{$i}rpx;
  }

  .pl-#{$i} {
    padding-left: #{$i}rpx;
  }

  .pt-#{$i} {
    padding-top: #{$i}rpx;
  }

  .pb-#{$i} {
    padding-bottom: #{$i}rpx;
  }

  .mr-#{$i} {
    margin-right: #{$i}rpx;
  }

  .ml-#{$i} {
    margin-left: #{$i}rpx;
  }

  .mt-#{$i} {
    margin-top: #{$i}rpx;
  }

  .mb-#{$i} {
    margin-bottom: #{$i}rpx;
  }
  .width-#{$i} {
    width: #{$i}rpx;
  }
}

@for $i from 0 to 10 {
  $i: $i + 1;
  .flex-#{$i} {
    flex: #{$i}px;
  }
}

// 主轴
$flex-jc: (
  'start': flex-start,
  'end': flex-end,
  'center': center,
  'between': space-between,
  'around': space-around,
  'evenly': space-evenly
);

// 侧轴
$flex-ai: (
  'start': flex-start,
  'end': flex-end,
  'center': center,
  'stretch': stretch,
  'baseline': baseline
);

//主轴 在这里循环我们上面定义的选择项
@each $flexKey, $flexValue in $flex-jc {
  .jc-#{$flexKey} {
    justify-content: $flexValue;
  }
}

// 侧轴
@each $flexKey, $flexValue in $flex-ai {
  .ai-#{$flexKey} {
    align-items: $flexValue;
  }
}

.w-90 {
	width: 90%;
}

.p-30 {
	padding: 30rpx;
}

.flex {
  display: flex;
}

.flex-column {
  flex-direction: column;
}

.flex-row {
  flex-direction: row;
}

.flex-wrap {
	flex-wrap: wrap;
}

.text-ellipsis {
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}

.text-ellipsis2 {
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.flex-shrink-0 {
  flex-shrink: 0;
}

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

.font-bold {
  font-weight: bold;
}

.relative {
	position: relative;
}